<%@ taglib prefix="C" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<!doctype html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>会员登录</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css"
          type="text/css"/>
    <script src="${pageContext.request.contextPath}/js/jquery-2.1.4.min.js"
            type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap-3.1.1.min.js"
            type="text/javascript"></script>
    <!-- 引入自定义css文件 style.css -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css" type="text/css"/>
    <style>
        body {
            margin-top: 20px;
            margin: 0 auto;
        }

        .carousel-inner .item img {
            width: 100%;
            height: 300px;
        }
    </style>
</head>

<body>
<jsp:include page="head.jsp"/>

<div class="container">
    <div class="row">

        <div style="margin:0 auto;margin-top:10px;width:950px;">
            <strong>订单详情</strong>
            <table class="table table-bordered">
                <tbody>
                <tr class="warning">
                    <th colspan="5">订单编号:${order.oid}</th>
                </tr>
                <tr class="warning">
                    <th>图片</th>
                    <th>商品</th>
                    <th>价格</th>
                    <th>数量</th>
                    <th>小计</th>
                </tr>

                <C:forEach items="${order.orderitems}" var="order">
                    <tr class="active">
                        <td width="60" width="40%">
                            <input type="hidden" name="id" value="22">
                            <img src="${pageContext.request.contextPath}/${order.product.image}"
                                 width="70" height="60">
                        </td>
                        <td width="30%">
                            <a target="_blank">${order.product.name}</a>
                        </td>
                        <td width="20%">
                            ￥${order.product.shopPrice}
                        </td>
                        <td width="10%">
                                ${order.count}
                        </td>
                        <td width="15%">
                            <span class="subtotal">￥${order.subtotal}</span>
                        </td>
                    </tr>
                </C:forEach>

                </tbody>
            </table>
        </div>

        <div style="text-align:right;margin-right:120px;">
            商品金额: <strong style="color:#ff6600;">￥${order.total}元</strong>
        </div>

    </div>

    <div>
        <hr/>
        <form class="form-horizontal" style="margin-top:5px;margin-left:150px;" action="${pageContext.request.contextPath}/order/CompleteOrder.do">
            <input type="text" name="oid" value="${order.oid}" hidden="true">
            <div class="form-group">
                <label for="address" class="col-sm-1 control-label">地址</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" id="address" name="address"
                           placeholder="请输入收货地址" value="">
                </div>
            </div>
            <div class="form-group">
                <label for="username" class="col-sm-1 control-label">收货人</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" id="username" name="username"
                           placeholder="请输收货人" value="">
                </div>
            </div>
            <div class="form-group">
                <label for="phone" class="col-sm-1 control-label">电话</label>
                <div class="col-sm-5">
                    <input type="text" class="form-control" id="phone" name="phone"
                           placeholder="请输入联系方式" value="">
                </div>
            </div>

            <hr/>

            <div style="margin-top:5px;margin-left:150px;">
                <strong>选择银行：</strong>
                <p>
                    <br/>
                    <input type="radio" name="pd_FrpId" value="ICBC-NET-B2C" checked="checked"/>支付宝
                    <img src="${pageContext.request.contextPath}/bank_img/icbc.bmp" align="middle"/>&nbsp;&nbsp;&nbsp;&nbsp;

                </p>
                <hr/>
                <p style="text-align:right;margin-right:100px;">

                    <button type="submit" id="sub" class="btn btn-default">提交订单</button>
                </p>
                <hr/>
            </div>
        </form>
    </div>

</div>

<jsp:include page="foot.jsp"/>

</body>

<script>
  $("#address").blur(function () {
    console.log($("#address").val().length());
    if ($("#address").val() != null){
      $("#sub").attr("disabled",true);
    }else {
      $("#sub").attr("disabled",false)
    }
  })
</script>
</html>